<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div>
        <!-- <label for="inputD">防抖</label> -->
        <input type="text" id="inputD">
    </div>
</body>
<script>
    //防抖,指的是在事件执行n秒之后执行回调,当在n秒内又被触发,则重新计时
    let func = function(val) {
        console.log("我是触发函数", val);
    }

    //防抖函数
    function debounce(fun, delay) {
        return function(args) {
            let that = this;
            let _args = args;
            clearTimeout(fun.id);
            fun.id = setTimeout(function() {
                fun.call(that, _args);
            }, delay)
        }
    }


    //测试
    let debounceTest = debounce(func, 500);
    setTimeout(function() {
        debounceTest("111");
    }, 1000);
</script>

</html>